<template>
	<!-- 存货分类树 -->
	<v-dialog v-model="invClassTreeModel.dialog" width="1000">
		<v-card>
			<p>{{invClassTreeModel.label}}</p>
			<v-card-title>
				<v-text-field v-model="search" append-icon="mdi-magnify" label="输入存货分类名称,不输入任何值按回车查询所有" @keypress.enter="loadInvClassTree" single-line hide-details>
				</v-text-field>
			</v-card-title>
			<v-card-text>
				<v-treeview item-disabled="locked" v-model="selectInvClassItems" :items="treeItems" item-key="id"
					return-object activatable open-on-click dense>
					<template v-slot:prepend="{ item, open }">
						<v-radio-group v-model="selectInvClass" dense>
							<v-radio v-model="item" :key="item.id" dense></v-radio>
						</v-radio-group>
					</template>
				</v-treeview>
			</v-card-text>
			<v-card-actions>
				<v-spacer></v-spacer>
				<v-btn class="mr-4" text @click="selectInvClassTreeSubmit">确认</v-btn>
				<v-btn color="warning" class="mr-4" text @click="close">取消</v-btn>

			</v-card-actions>
		</v-card>
	</v-dialog>
</template>

<script>
	export default {
		name: 'InvClassTree',
		props: {
			callBack: {
				type: Function, //参数类型：函数
			},
			invClassTreeModel: {
				dialog: false,
				getTreeUrl: ``,
				label: '选择存货分类',

			},
		},
		data: () => ({
			treeItems: [],
			selectInvClassItems: [],
			selectInvClass: {},
			search:''
		}),
		watch: {
			invClassTreeModel: {
				handler(newVal) {
					this.$emit('update:invClassTreeModel', newVal)
					this.loadInvClassTree()
				},
				deep: true
			},
		},
		methods: {
			async loadInvClassTree() {
				if (!this.invClassTreeModel.dialog) {
					return
				}
				var response = await this.$httpRequest({
					url: this.invClassTreeModel.getTreeUrl+`&name=${this.search}`,
					method: 'get'
				})
				if (response.status == 1) {
					this.treeItems = response.data
				} else {
					this.$message.error(response.info)
				}
			},

			close() {
				this.invClassTreeModel.dialog = false
				this.selectInvClass = {}
			},
			selectInvClassTreeSubmit() {
				this.$props.callBack(this.selectInvClass)
				this.close()
			},

		}
	}
</script>

<style>
</style>
